<template>
    <div class="wrapper">
        <div class="navbar">
            <p>设置密码</p>
            <span @click="$router.push('/main')">跳过</span>
        </div>
        <div class="pass">
            <van-form @submit="onSubmit">
                <van-field v-model="password" type="password" placeholder="请设置登录密码" />
                <van-field v-model="password2" type="password" placeholder="请再次输入密码" />
                <div style="margin: 16px;">
                    <van-button round block type="primary" native-type="submit">提交</van-button>
                </div>
            </van-form>
        </div>
    </div>
</template>
  
<script>
import { setPassPort } from '@/api/login'
export default {
    data() {
        return {
            password: '',
            password2: ''
        }
    },
    computed: {},
    created() { },
    mounted() {
        console.log(this.$route.params);
     },
    watch: {},
    methods: {
        async onSubmit(v) {
            console.log(v)
            if (this.password !== this.password2) {
                this.$Toast({
                    message: '两次密码不一致',
                    position: 'top'
                })
                return false
            }
            let mobile = this.$route.params.mobile
            console.log(this.$route.params.mobile)
            let sms_code = this.$route.params.sms_code
            let res = await setPassPort({ mobile:mobile, password: this.password, sms_code:sms_code })
            if (res.code == 200) {
                this.$router.push('/main')
            } else {
                this.$Toast({
                    message: res.msg,
                    position: 'top'
                })
            }

        }
    },
    components: {}
}
</script>
  
<style lang="scss" scoped>
.wrapper {
    width: 100vw;
    box-sizing: border-box;
    background: #fff;
    padding: 10px 0;

    .navbar {
        width: 100%;
        height: 44px;
        position: relative;
        font-size: 24px;

        p {
            text-align: center;
            line-height: 44px;
            margin: 0;
        }

        span {
            position: absolute;
            right: 20px;
            top: 10px;
            font-size: 20px;
            color: #999;
        }
    }

    .van-field {
        // height: 60px;
        font-size: 25px;
        // margin: 40px 20px;
        padding: 40px 20px;
        box-sizing: border-box;
        input {
            height: 60px;
            line-height: 60px;
        }
    }

    .van-button {
        background-image: linear-gradient(to right, #f5b65e, #eb7834);
        font-size: 24px;
        height: 64px;
    }
}
</style>
  